<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<th:block th:include="common/head :: head('')"/>
<th:block th:include="include :: swiper-css"/>
<th:block th:include="include :: swiper-js"/>

<body>
<th:block th:include="common/head :: header('/')"/>
<div class="page-main">
    <div class="index-block">
        <div class="block-swiper">
            <div class="swiper-container" style="width: 100%; height: 100%;">
                <div class="swiper-wrapper" th:with="list=${thumbs}">
                    <div class="swiper-slide"
                         th:each="item : ${list}"
                         th:style="'background:url('+${item.thumb}+'); background-size: 100% 100%;'"
                         th:data-ref="${item.id}"
                         th:data-uuid="${item.uuid}"
                         th:data-link="${item.ext1}"
                         th:data-target="${item.ext2}"
                    ></div>
                </div>
                <!-- Add Pagination -->

            </div>
            <div class="swiper-pagination swiper-pagination-white"></div>
        </div>
        <div class="block-news">
            <div class="block-news-wrap">
                <div class="block-news-main"
                     th:each="item,it : ${thumbs}"
                     th:id="'title_'+ ${item.id}"
                     th:style="${it.count == 1 ? 'display:block;' : ''}">


                    <a th:if="${#strings.isEmpty(item.ext1)}" class="block-news-title" th:href="'/web/news/view/' + ${item.uuid}" th:text="${item.title}"></a>
                    <a th:if="${!#strings.isEmpty(item.ext1)}" th:target="${item.ext2}" class="block-news-title" th:href="${item.ext1}" th:text="${item.title}"></a>


                    <div class="block-news-brief" th:text="${item.brief}"></div>
                </div>
            </div>
            <div class="block-news-sub" th:with="contents=${news}">
                <ul class="block-news-list">
                    <li class="block-news-list-item" th:each="content,it : ${contents}">
                        <a th:href="'/web/news/view/' + ${content.uuid}" th:text="${content.title}"></a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<div class="index-banner" th:with="banners=${@webInfo.getCmsInfoListBykey('banner')}">
    <div class="index-banner-item" th:each="banner : ${banners}">
        <img th:src="${banner.imgUrl}"/>
    </div>
</div>

<div class="page-main index-block2">
    <div class="index-about">
        <div class="common-block">
            <div class="common-block-title">
                <img class="common-block-title__ico" src="/img/people.svg"/>
                <span class="common-block-title__txt">关于我们</span>
            </div>
            <div class="common-block-content" th:with="abouts=${@webInfo.getCmsContentByKind('ABOUT', '', 3)}">
                <a th:href="${#strings.isEmpty(about.ext2) ? '#' :  about.ext2}" class="about-item"
                   th:each="about : ${abouts}">
                    <img th:src="${about.ext1}"/>
                    <div class="about-item-name" th:utext="${about.title}"></div>
                </a>
            </div>
        </div>
    </div>
    <div class="index-public">
        <div class="common-block">
            <div class="common-block-title">
                <img class="common-block-title__ico" src="/img/open.svg"/>
                <span class="common-block-title__txt">公共服务</span>

                <div class="common-block-tool" th:if="${!@permission.isUser()}">
                    <!--<div class="tool-icon">
                        <i class="fa fa-user"></i>
                    </div>
                   <a class="tool-btn" th:href="@{/login}">登录</a>
                    <a class="tool-btn" th:href="@{/register}">注册</a>-->
                </div>
            </div>
            <div class="common-block-content">
                <div class="public-item">
                    <img class="public-item-bg" src="/img/service1.png"/>
                    <a class="public-item-wrap" href="/serve?tab=1">
                        <img class="public-item-ico" src="/img/ico_01.svg"/>
                        <div class="public-item-title">
                            威胁情报检索
                        </div>
                        <div class="public-item-txt">
                            <p>对IP、域名、文件Hash、证书指纹、邮箱地址等线索进行查询，查看相关威胁信息、异常行为</p>
                        </div>
                    </a>
                </div>

                <div class="public-item">
                    <img class="public-item-bg" src="/img/service2.png"/>
                    <a class="public-item-wrap" href="/serve?tab=2">
                        <img class="public-item-ico" src="/img/ico_02.svg"/>
                        <div class="public-item-title">
                            病毒举报&溯源
                        </div>
                        <div class="public-item-txt">
                            <p>病毒举报：对病毒文件进行上传，并举报。</p>
                            <p>病毒溯源：分析病毒文件，监测相关信息，分析病毒源头。</p>
                        </div>
                    </a>
                </div>

                <div class="public-item">
                    <img class="public-item-bg" src="/img/service3.png"/>
                    <a class="public-item-wrap" href="/serve?tab=3">
                        <img class="public-item-ico" src="/img/ico_03.svg"/>
                        <div class="public-item-title">
                            App检测&加固
                        </div>
                        <div class="public-item-txt">
                            <p>APP检测：及时发现安全功能设计缺陷，漏洞，快速生成监测报告。</p>
                            <p>APP加固：防止应用被反编译和恶意篡改、二次打包，数据信息泄露</p>
                        </div>
                    </a>
                </div>

                <div class="public-item">
                    <img class="public-item-bg" src="/img/service4.png"/>
                    <a class="public-item-wrap" href="/serve?tab=4">
                        <img class="public-item-ico" src="/img/ico_04.svg"/>
                        <div class="public-item-title">
                            暗网监测服务
                        </div>
                        <div class="public-item-txt">
                            <p>为企业提供暗网监测服务，查询企业信息是否出现泄露、泄露内容类型等信息，形成专项报告</p>
                        </div>
                    </a>
                </div>

            </div>
        </div>
    </div>
</div>

<div class="page-main index-block3 mt20">
    <div class="index-safe">
        <div class="common-block">
            <div class="common-block-title">
                <img class="common-block-title__ico" src="/img/document.png"/>
                <span class="common-block-title__txt">安全摘要</span>

                <div class="common-block-tool">
                    <a href="/web/safetyAll">全部 <i class="fa fa-angle-right"></i></a>
                </div>
            </div>
            <div class="common-block-content" th:with="list=${@webInfo.getCmsContentByKind('SAFE', '', 6)}">
                <div class="safe-item" th:each="item : ${list}">
                    <a class="safe-item-title" th:href="'/web/safety/view/' + ${item.uuid}" th:text="${item.title}"></a>
                    <a class="safe-item-more" th:href="'/web/safety/view/' + ${item.uuid}">阅读详情</a>
                </div>
            </div>
        </div>
    </div>
    <div class="index-virus">
        <div class="common-block">
            <div class="common-block-title is-right">
                <span class="common-block-title__txt">病毒预报</span>
                <img class="common-block-title__ico" src="/img/warning.png"/>

                <div class="common-block-tool">
                    <a href="/web/virusAll"> <i class="fa fa-angle-left"></i> 全部</a>
                </div>
            </div>
            <div class="common-block-content" th:with="list=${@webInfo.getCmsContentByKind('VIRUS', '', 6)}">
                <div class="virus-item" th:each="item : ${list}">
                    <span class="virus-item-more">病毒预报</span>
                    <a class="virus-item-title" th:href="'/web/safety/view2/' + ${item.uuid}" th:text="${item.title}"></a>
                </div>
            </div>
        </div>
    </div>
</div>

<th:block th:include="common/head :: link"/>
<th:block th:include="common/head :: footer"/>
<th:block th:include="common/head :: float"/>
</body>

<th:block th:replace="common/head :: float-js"/>

<script th:inline="javascript">
    var swiper = new Swiper('.swiper-container', {
        autoplay: {
            delay: 15000
        },
        loop: true,
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },
        effect: 'fade',
        on: {
            click: function () {
                const target = $('.swiper-container').find('.swiper-slide-active')
                if(target.length > 0) {
                    const ref = target.eq(0).attr('data-ref')
                    const uuid = target.eq(0).attr('data-uuid')
                    const link = target.eq(0).attr('data-link')
                    const _target = target.eq(0).attr('data-target')
                    if(!link) {
                        window.location.href = ctx + 'web/news/view/' + uuid
                        return
                    }

                    if(_target) {
                        window.open(link, _target)
                    } else {
                        window.location.href = link
                    }

                }

            },
            slideChangeTransitionEnd: function () {

                const target = $('.swiper-container').find('.swiper-slide-active')

                if(target.length > 0) {
                    const ref = target.eq(0).attr('data-ref')
                    $('.block-news-main').hide()
                    $('#title_' + ref).fadeIn()
                }

            }
        }
    });
</script>
</html>

